import React, { Component } from "react";
import "./index.less"
import * as echarts from '../ec-canvas/echarts'

export default class Chart extends Component{

  static defaultProps = {
    height:"400px"
  }

  constructor(props) {

    super(props);
    this.state = {
      ec: {
        onInit: this.initChart.bind(this)
      }
    }
  }

  initChart(canvas, width, height, dpr) {
    const chart = echarts.init(canvas, null, {
      width: width,
      height: height,
      devicePixelRatio: dpr // new
    });
    canvas.setChart(chart);
    console.log(this.props);
    this.props.setChartOptions(chart)

    return chart;
  }
  render() {

    console.log(this.props);
    let style = {
      height:this.props.height
    }
    return(

      <view className='container' style={style}>
        <ec-canvas id="mychart-dom-pie" canvas-id="mychart-pie" ec={this.state.ec} />
      </view>

    )
  }
}


